<template>
  <div>
    <PageWrapper :title="getTitle">
      <BasicTable @register="registerTable" :rowSelection="rowSelection">
        <template #tableTitle>
          <a-dropdown v-if="selectedRowKeys.length > 0">
            <template #overlay>
              <a-menu>
                <a-menu-item key="1" @click="batchHandleDelete">
                  <Icon icon="ant-design:delete-outlined" />
                  删除
                </a-menu-item>
              </a-menu>
            </template>
            <a-button
              >批量操作
              <Icon icon="ant-design:down-outlined" />
            </a-button>
          </a-dropdown>
        </template>
        <template #action="{ record }">
          <TableAction :actions="getActions(record)" />
        </template>
      </BasicTable>
    </PageWrapper>
  </div>
</template>
<script lang="ts" name="rpa-task" setup>
  import { ref, unref, computed } from 'vue';
  import { BasicTable, TableAction } from '/@/components/Table';
  import { useModal } from '/@/components/Modal';
  import { list, deleteTask, stopTask } from './task.api';
  import { columns } from './task.data';
  import { useMessage } from '/@/hooks/web/useMessage';
  import { useListPage } from '/@/hooks/system/useListPage';
  import { useRouter } from 'vue-router';
  import { PageWrapper } from '/@/components/Page';

  const { currentRoute, push } = useRouter();
  const route = unref(currentRoute);
  const { createMessage } = useMessage();

  let flowId = route.query.flowId;
  let flowName = route.query.flowName;

  // 列表页面公共参数、方法
  const { prefixCls, onExportXls, onImportXls, tableContext } = useListPage({
    designScope: 'rpa-task-template',
    tableProps: {
      title: '任务列表',
      api: list,
      columns: columns,
      beforeFetch: handleBeforeFetch,
      useSearchForm: false
    },
  });

  const [registerTable, { reload }, { rowSelection, selectedRowKeys }] = tableContext;

  //设置标题
  const getTitle = computed(() => flowName? flowName+'-任务详情':'任务详情');

  /**
   * 操作列定义
   * @param record
   */
  function getActions(record) {
    return [
      {
        label: '停止',
        popConfirm: {
          title: '您确定要停止该任务吗',
          confirm: handleStop.bind(null, record),
        },
      },
      {
        label: '查看',
        onClick: handleView.bind(null, record),
      },
      {
        label: '删除',
        popConfirm: {
          title: '是否确认删除',
          confirm: handleDelete.bind(null, record),
        },
      },
    ];
  }

  // 处理查询请求参数
  function handleBeforeFetch(params) {
    params.flowId = flowId;
    return params;
  }

  /**
   * 停止事件
   */
  function handleStop(record) {
    stopTask({ id: record.id }, reload);
  }

  /**
   * 查看事件
   */
  function handleView(record) {
    push({
      path: '/rpa/task/detail',
      query: {
        flowId: flowId,
        flowName: flowName,
        taskId: record.id
      },
    });
  }

  /**
   * 删除事件
   */
  function handleDelete(record) {
    deleteTask({ id: record.id }, reload);
  }


</script>
